<template>
	<view>
		<!-- 顶部导航 -->
		<view class="navBar">
			 <u-navbar autoBack="true"  @leftClick="leftClick" title="商城列表" rightIcon="map" @rightClick="rightClick"></u-navbar>
		</view>
		<!-- 加载商品组件 -->
		<shopping-list @shoppingItemsClick="goShoppingDetail" :shopping="shopping"></shopping-list>
	</view>
</template>

<script>
	import shoppingList from '../../components/shopping-list/shopping-list.vue'
	export default {
		data() {
			return {
				pageindex:1,
				shopping:[]
			}
		},
		onLoad() {
			this.getShoppingList()
		},
		components:{"shoping-list":shoppingList},
		methods: {
			async getShoppingList(callback){
				const res = await this.$myRequest({
					url:'/index.php?m=app&c=shopping&a=index&page='+this.pageindex
				})
				this.shopping = [...this.shopping,...res.data.data.list]
				callback && callback()
			},
			goShoppingDetail(id){
				uni.navigateTo({
					url:'/pages/shopping-detail/shopping-detail?id='+id
				})
			},
			rightClick(){
				uni.redirectTo({
					url:'../map/map'
				})
			},
			leftClick() {
				console.log('leftClick');
			}
		},
		onReachBottom() {
			this.pageindex++
			this.getShoppingList()
		},
		onPullDownRefresh() {
			this.pageindex = 1
			this.shopping = []
			setTimeout(()=>{
				this.getShoppingList()
				uni.stopPullDownRefresh()
			},1000)
		},
	}
</script>

<style>
	.navBar{
		border-bottom: 1px solid #ccc;
	}
</style>
